<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <!-- 浏览器端ak -->
        <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=RV3io7P1qcpsGeEfpXVXQYkmf8PcITgc"></script>

        <style type="text/css">
            body{
                background: -webkit-linear-gradient(left, #DAE4E3, #C0D3D7);
            }
        </style>
    </head>
    <body>
        <div >请输入地址：<input id="suggestId" name="" type="text" class="" required="required"></div>
        <div >请输入查询范围：<input id="queryScope" type="text" class="" value="500">米</div>
    </body>
</html>

<script type="text/javascript">
    // 百度地图API功能
    loadMapAutocomplete("suggestId");
    function loadMapAutocomplete(mySuggestId) {
        //建立一个自动完成的对象
        Ac = new BMap.Autocomplete(
            {
                "input": mySuggestId
            });
    }

    function getLocation() {
        return document.getElementById('suggestId').value;
    }
    function getScope() {
        return document.getElementById('queryScope').value;
    }
    function clearLocation() {
        document.getElementById('suggestId').value = "";
    }

</script>